<script setup lang="ts">
import { reactive } from 'vue'
import { ContentWrap } from '@/components/ContentWrap'
import { Table } from '@/components/Table'
import { sysCompetitionSignupList } from '@/api/competition/index'
import { CrudSchema, useCrudSchemas } from '@/hooks/web/useCrudSchemas'
import { useTable } from '@/hooks/web/useTableTest'

// const searchRef = ref() // 搜索的标签
// 获取参数
const props = defineProps({
  signupTeam: {
    type: Object,
    default: () => null
  }
})
console.log('signupTeam', props.signupTeam)

const { register, tableObject, methods } = useTable<
  {
    total: number
    list: any[]
  },
  any
>({
  getListApi: sysCompetitionSignupList,
  response: {
    data: 'data',
    count: 'count'
  }
})

const { getList, setSearchParams } = methods

const crudSchemas = reactive<CrudSchema[]>([
  {
    field: 'signup_team_id',
    label: '主键',
    fixed: 'left',
    width: 60,
    table: {
      show: true
    },
    detail: {
      show: false
    }
  },
  {
    field: 'name',
    label: '队员名称',
    search: {
      show: true
    }
  },
  {
    field: 'mobile',
    label: '队员手机号',
    search: {
      show: true
    }
  },
  {
    field: 'create_time',
    label: '创建时间'
  },

  {
    field: 'action',
    width: 200,
    fixed: 'right',
    label: '操作',
    form: {
      show: false
    },
    detail: {
      show: false
    }
  }
])

const { allSchemas } = useCrudSchemas(crudSchemas)

/****************************** 初始化 start ******************************/
const init = async () => {
  // 列表查询
  await getList()
}
init()
/****************************** 初始化 end ******************************/
</script>

<template>
  <ContentWrap>
    <Table
      v-model:pageSize="tableObject.pageSize"
      v-model:currentPage="tableObject.currentPage"
      :columns="allSchemas.tableColumns"
      :data="tableObject.tableList"
      :loading="tableObject.loading"
      :border="true"
      :pagination="{
        total: tableObject.count
      }"
      @register="register"
      :selection="false"
    />
  </ContentWrap>
</template>
